<template>
  <S :search="search" :loading="loading" @search="submit"></S>
  <a-table :loading="loading" :dataSource="data" :columns="columns">
    <template #bodyCell="{ column, record }">
      <template v-if="column.key === 'action'">
        <a-space>
          <a-button type="primary">详情</a-button>
          <a-button danger>删除</a-button>

        </a-space>
      </template>
    </template>
  </a-table>
</template>

<script setup>
import { onMounted, ref } from 'vue'
import S from './Search.vue'

const emits = defineEmits(['update:data'])

const props = defineProps({
  search: {
    type: Array,
    default: []
  },
  data: {
    type: Array,
    default: []
  },
  apiProps: {
    type: Function,
    default: null
  }
})

const submit = (data) => {
  getList({ ...data })
}

onMounted(() => {
  getList()
})

const loading = ref(false)

const getList = (search) => {
  if (loading.value) {
    return
  }
  if (props.apiProps) {
    loading.value = true
    props
      .apiProps(search)
      .then((res) => {
        console.log(res)
        emits('update:data', res.rows)
      })
      .finally(() => {
        loading.value = false
      })
  }
}

const columns = [
  {
    title: '姓名',
    dataIndex: 'menuId',
    key: 'menuId'
  },
  {
    title: '平台',
    dataIndex: 'platformName',
    key: 'platformName'
  },
  {
    title: '平台编号',
    dataIndex: 'platformNo',
    key: 'platformNo'
  },
  {
    title: '操作',
    dataIndex: 'action',
    key: 'action'
  }
]
</script>

<style scoped></style>
